/**
 * @package Helix Framework
 * @author JoomShaper http://www.joomshaper.com
 * @copyright Copyright (c) 2010 - 2014 JoomShaper
 * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 or later
*/

.responsive {
	/* ******************* Large Devices, Wide Screens ******************* */
	@media only screen and (max-width : 1200px) {
		//Menu
		#sp-main-menu ul.level-0 > li{
			margin: 0 15px 0 0;
			>a{
				padding: 10px 5px;
			}
		}
		// Right photo gallery
		aside#sp-right .newsplus-gallery a{width: 22%;}

	}

	/* Medium Devices, Desktops */
	@media only screen and (max-width : 979px) {
		#sp-header-wrapper{
		[class*="span"] {
				width:auto;
				float:left;
				&#sp-menu{
					float:right;
				}
			}
		}
		// Menu section
		#sp-menu-wrapper{
			#menu{
				#sp-menu{
					display: none;
				}
				#sp-weather{
					width: 150px;
					float: left;
				}
			}
		}
		// Top ADD
		#sp-logo-wrapper .top-add{
			text-align: right;
			.banneritem img{width: 75%;}
		}
		//Mobile Menu
		.nav-collapse, .responsive .nav-collapse.collapse {
		    top: 250px;
		}
		// Content top
		#sp-content-top-wrapper{
			//Slideshow
			#sp-slide-show{float: none; width: 100%;}
			#content-top >.span6:last-child {
				border-left: none;
				padding-left: 0;
				margin-left: 0;
			}
			#sp-populer-news{
				float: none;
				width: 100%;

			}
			//Populer news
			.sp-top-populer-news .ns2-art-wrap .ns2-art-pages .ns2-row .ns2-inner {
				>a{
					width: 100%;
					float: none;
					img{
						width: 100%;
					}
				}
			}
		}
		//Content Top 2
		#sp-content-top-2-wrapper{
			// Recent news
			.ns2-top-news-list .ns2-wrap .ns2-art-wrap{
				.ns2-inner a.ns2-img-wrapper {margin: 0 10px 0 0 !important;}
			}
			.ns2-top-news-list .ns2-links-wrap .ns2-page-inner .ns2-row{
				img.ns2-image{display: none;}
			}
		}
		// Main body feature news
		#sp-main-body-wrapper #main-body #sp-component-area .sp-inset-news .ns2-art-wrap .ns2-row .ns2-column{
			.ns2-inner >a{width: 100%; margin: 0 0 10px !important;
				img{width: 100%;}
			}

			h4.ns2-title{
				font-size: 16px;
			}
		}

		// Right Tab
		aside#sp-right .right-sp-tab .tabs_buttons ul.tabs_container li{
			padding: 0 7px;
			span.sptab-title{font-size: 12px;}
		}
		//Right Gallery
		aside#sp-right .newsplus-gallery a{
			width: 30%;
			img.sp_simple_gallery{
				width: 100%;
			}
		}
		//Footer Social
		#sp-bottom-2nd-row-wrapper .social-row1 ul li a,  #sp-bottom-2nd-row-wrapper .social-row2 ul li a{margin-right: 12px;}

	}


	/* ******************* Small Devices, Tablets ******************* */
	@media only screen and (max-width : 767px) {
		&.bg {
			padding-left: 0;
			padding-right: 0;
		}
		// Top menu
		ul.header-top-menu >li{margin-right: 10px;}

		 .container {
			padding:0 10px;
			max-width:480px;
			min-width:280px;
		}
		//top logo
		#sp-logo-wrapper{
			padding: 20px 0;
			.logo{ display: inline-block;}
			#sp-logo{text-align: center;}
			#sp-top-add{
				display: inline-block;
				margin-top: 10px;
			}
		}
		// Top ADD
		#sp-logo-wrapper .top-add{
			.banneritem img{width: 100%;}
		}

		// Mobile Menu
		.sp-main-menu-toggler.btn{
			top: 252px;
		}
		.nav-collapse, .nav-collapse.collapse{
			top: 303px;

		}
		//Weather	
		.sp-weather.flat-layout .sp-weather-forcasts{
			width: 150px;
			.list .media > .pull-left{
				float: left;
			}
		}

		#sp-feature-wrapper {
			padding:20px 0;
			#feature {
				h1{
					font-size:200%;
					line-height:200%;
				}
				p{
					font-size:100%;
				}
				.btn{
					.btn-mini();
					margin-bottom:5px;
				}
			}
		}
		// News Highlighter & Search
		#sp-news-highlight-wrapper{

			#sp-search{
				margin-top: 10px;
				.input-append{
					float: none;
					width: 100%;
					text-align: right;
					input[type="text"]{

					}
				}
				
			}
		}

		//Content Top 2
		#sp-content-top-2-wrapper{
			#sp-content-top-left{
				margin-bottom: 10px;
			}
			.ns2-top-news-list .ns2-links-wrap .ns2-page-inner .ns2-row{
				margin-top: 10px;
				width: 50%;
				&.ns2-first{
					padding-right: 10px !important;
				}
				img.ns2-image{display: block;}
			}
		}

		#sp-content-top-2-wrapper #content-top-2 >.span6:last-child{
			border-left: none;
			padding-left: 0;
		}
		// Main body
		#sp-main-body-wrapper #main-body #sp-component-area{
			border-right: none;
			>section{
				border-bottom: 1px solid #cccccc;
				padding-bottom: 20px;
				margin-bottom: 20px;
			}
			.sp-inset-news .ns2-art-wrap .ns2-row .ns2-column{
				.ns2-inner a.ns2-img-wrapper{
					width: 40%;
					margin: 0 10px 0 0 !important;
				}
				img.ns2-image{
					margin: 0 20px 0 0 !important;
				}
			}
			// Footer News
			#sp-inset-5-7-wrapper #inset-5-7 .ns2-inset-bottom-news .ns2-wrap .ns2-page .ns2-column .ns2-inner{
				a{margin: 0 10px 0 0 !important;}
				img.ns2-image{float: left !important;}
				h4.ns2-title{
					font-size: 15px;
					margin-bottom: 8px;
				}
			}
		}
		// Right Tab
		aside#sp-right .right-sp-tab .sptab_red .tab-padding .right-for-sp-tab ul li a.moduleItemImage{
			img{width: 100%;}
		}

		// Right ADD
		#sp-right{
			.bannergroup{
				.banneritem{
					text-align: center;
				}
			}
		}
		// Right Gallery
		aside#sp-right .newsplus-gallery a{width: 22%;}

		// Bottom
		#sp-bottom-wrapper{
			#bottom{
				>div{
					margin-bottom: 15px;
				}
			}
		}
		#sp-bottom-2nd-row-wrapper{
			.social-row1, .social-row2{display: inline-block;}
			.bottom-ad{float: none !important;}
			#sp-bottom8{margin: 15px 0;}
			div[class*="span"]{text-align: center;margin-bottom: 15px;}
		}
		// Copyright & credit
		#sp-footer-wrapper {
			#sp-footer1{
				text-align: center;
				margin-bottom: 10px;
			}
			#sp-footer2{
				text-align: center;
			}
		}

		/*-- Sub pages --*/
		// Catepory
		#k2Container .itemList{
			.categoryLeadingleft{border-right: none; padding-right: 0;}
			.hot-news-wrapper{
				h3.section-title{
					border-bottom: 1px solid #f2f2f2;
					padding-bottom: 10px;
				}
				.hot-news-item-block{
					a.hot-news-link{ float: left; padding-right: 10px;}
				}
				.item-info-wrapper{
					.hot-item-title{
						padding: 0;
					}
				}
			}
		}

	}

	/* ******************* Extra Small Devices, Phones ******************* */
	@media only screen and (max-width : 480px) {

		//module title
		.module h3{
			margin: 0 0 10px 0;
		}
		//News show SP2 more news
		.nssp2 .ns2-more-news{
			top: -32px;
		}
		div.nssp2 .col-4{
			width: 50%;
			margin-bottom: 10px;
		}

		//Header Menu
		ul.header-top-menu > li {
		    margin-right: 0;
		    >a{
		    	font-size: 11px;
		    	padding-right: 10px;
		    }
		}

		ul.header-top-menu >li ul{min-width: 100px;}

		// Mobile Menu
		.sp-main-menu-toggler.btn {
		    top: 229px;
		}
		.nav-collapse, .nav-collapse.collapse {
		    top: 276px;
		}
		//Search
		#sp-news-highlight-wrapper #sp-search input[type="text"]{width: 90%;}

		//Slideshow
		.sp-k2-featured-slider .item-content{
			padding: 0 0 5px 5px;
			.item-title, .item-meta, .item-introtext{
				line-height: 16px;
				margin: 0;
			}
			.item-title{
				font-size: 15px;
				margin-bottom: 5px;
			}
			.item-meta{
				font-size: 10px;
			}
			.item-introtext{
				font-size: 13px;
			}
		}

		//Main body
		#sp-main-body-wrapper #main-body #sp-component-area{
			>section{
				padding-bottom: 10px;
				margin-bottom: 10px;
			}
		}
		//News Show SP2
		#feature-news > div, #top-inset >div, #mid-inset >div{
			margin-top: 10px; 
			padding-top: 10px; 
			border-top: 1px solid #cccccc;
			&:first-child{
				margin-top: 0; 
				padding-top: 0; 
				border-top: none;
			}
		}
		#bottom-inset .nssp2 .ns2-art-wrap a.ns2-img-wrapper{
			float: none;
			img.ns2-image{
				width: 100%;
			}
		}
		.ns2-top-news-list .ns2-links-wrap .ns2-inner a.ns2-img-wrapper{
			float: none;
			margin: 0 0 5px !important;	
			img{
				width: 100%;
			}
		}

		// Populer News
		#sp-content-top-wrapper #content-top .sp-top-populer-news{
			.ns2-art-wrap{
				float: none;
				width: 100%;
			}
			.ns2-links-wrap{
				float: none;
				width: 100%;
				.ns2-links-pages {
					padding-left: 0px;
					.ns2-page{
						 .ns2-row{
						 	float: left;
						 	width: 30%;
							padding-left: 8px;
							margin-left: 8px;
							padding-top:0;
							margin-top: 0;
							border-top: none;
							border-left: 1px solid #f2f2f2;
							.ns2-row-inner{
								.ns2-inner{
									a.ns2-img-wrapper{
										float: none;
										margin: 0 !important;
										img{width: 100%;}
									}
								}
							}
							&:first-child{
								padding-left: 0px;
								margin-left: 0px;
								border-left: none;
							}
						 }
					}
				}
			}
		}
	}

	/* ******************* Custom, iPhone Retina ******************* */ 
	@media only screen and (max-width : 320px) {
		ul.header-top-menu > li > a{
			font-size: 10px;
			padding-right: 7px;
		}
		ul.header-top-menu >li ul{min-width: 90px;}
		#sp-logo-wrapper .logo{ padding: 0 5px;}
		//Menu
		.nav-collapse, .nav-collapse.collapse{top: 281px;}
		
	}


	/*-- END:: Landscape phones and down --*/




	
}

//Fixed width
.fixed{
	.hidden-desktop{
		display:none;
	}
}